/**
 * 使用说明
 * @param dom 嵌入Echarts的元素ID
 * @param title Echarts标题
 * @param xAxis Echarts X轴数据
 * @param ySeries Echarts Y轴数据
 * @constructor
 */
function ET(dom, title, xAxis, ySeries) {
    ET.prototype.dom = dom; // 元素ID
    ET.prototype.title = title; // 标题
    ET.prototype.xAxis = xAxis; // X 轴坐标
    ET.prototype.ySeries = ySeries; // 数据实例[{a:[1,2,3]},b:[1,2,3]}]
    ET.prototype.option = null; // 数据实例[{a:[1,2,3]},b:[1,2,3]}]
    ET.prototype.myChart = null; // 数据实例[{a:[1,2,3]},b:[1,2,3]}]
    ET.prototype.draw = function () {
        let msg = this.beforeDraw();
        if (msg === 'ok') {
            let $dom = document.getElementById(this.dom);
            this.myChart = echarts.init($dom);
            this.option = this.getOption();
            if (this.option && typeof this.option === "object") {
                this.myChart.setOption(this.option, true);
                window.onresize = this.myChart.resize;
            }
        } else {
            console.log(msg);
        }
    };
    ET.prototype.reDraw = function (title, xAxis, ySeries) {
        if (title) {
            this.option.title.text = title;
        }
        if (Array.isArray(xAxis)) {
            this.option.xAxis.data = xAxis;
        }
        if (Object.keys(ySeries).length > 0) {
            this.setSeries(ySeries);
        }
        this.myChart.setOption(this.option, true);
        this.myChart.resize();
    };
    ET.prototype.beforeDraw = function () {
        let msg = 'ok';
        let $dom = document.getElementById(this.dom);
        // 判断dom 是否合法
        if (!$dom) {
            msg = '当前ID的DOM对象不存在';
        }
        // 判断数据是否合法
        if (!Array.isArray(this.xAxis)) {
            msg = 'X轴坐标值合法';
        }
        if (Object.keys(this.ySeries).length === 0) {
            msg = 'Y轴坐标值合法';
        }
        return msg;
    };
    ET.prototype.getOption = function () {
        if (Object.keys(this.ySeries).length > 0) {
            let legend = [], series = [];
            for (let key in this.ySeries) {
                legend.push(key);
            }
            let option = {
                backgroundColor: 'rgba(0,0,0,0)',
                color: ['#1E9FFF', '#5FB878', '#FF5722', '#009688', '#FFB800', '#FFB800'],
                title: {
                    text: this.title
                },
                tooltip: {
                    trigger: 'axis'
                },
                grid: {
                    left: '0%',
                    right: '3%',
                    bottom: '2%',
                    containLabel: true
                },
                toolbox: {
                    show: false
                },
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    data: xAxis,
                    axisTick: {
                        show: false
                    }
                },
                yAxis: {
                    type: 'value',
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    }
                }
            };
            option['legend'] = {
                right: '0',
                data: legend
            };
            for (let i = 0; i < legend.length; i++) {
                let obj = {};
                let v = legend[i];
                obj['name'] = v;
                obj['type'] = 'line';
                /*obj['stack'] = '访问量';*/
                obj['data'] = this.ySeries[v];
                series.push(obj);
            }
            option['series'] = series;
            return option;
        }
        return null;
    };
    ET.prototype.setSeries = function (ySeries) {
        // this.option;
        let legend = [], series = [];
        for (let key in ySeries) {
            legend.push(key);
        }
        this.option['legend'] = {
            right: '0',
            data: legend
        };
        for (let i = 0; i < legend.length; i++) {
            let obj = {};
            let v = legend[i];
            obj['name'] = v;
            obj['type'] = 'line';
            obj['stack'] = '访问量';
            obj['data'] = ySeries[v];
            series.push(obj);
        }
        this.option['series'] = series;
    }
}

// 举个栗子:
/*let x = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
let y = {
    '访问次数': [120, 132, 101, 134, 90, 230, 210],
    '访客人数': [220, 182, 191, 234, 290, 330, 310],
    '点赞人数': [150, 232, 201, 154, 190, 330, 410]
};
let et = new ET('visit_uv', '近一周访问UV视图', x, y);
et.draw();*/


